<template>
	<view class="bottom" :style="{'margin-top': top}">
		<view class="left">
			<slot>
				<image :src="getImageUrl('ic_arrow_left_white.png')" style="width: 48rpx;" mode="widthFix" @click="back"></image>
			</slot>
		</view>
		
		<view class="right" @click="next">
			<view class="bin-confirm">确认</view>
			<image :src="getImageUrl('ic_arrow_right_white.png')" style="width: 30rpx;" mode="widthFix"></image>
		</view>
	</view>
</template>

<script>
	export default {
		name: "zy-register-bottom",
		data() {
			return {

			};
		},
		props:{
			top:{
				type: String,
				default: function(){
					return '260rpx'
				}
			}
		},
		methods:{
			back(){
				uni.navigateBack();
			},
			next(){
				this.$emit('next')
			}
		}
	}
</script>

<style lang="scss" scoped>
	.bottom {
		display: flex;
		flex-direction: row;
		align-items: center;
		
		.left{
			flex: 1;
		}

		.right {
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;
			width: 150rpx;
			height: 80rpx;
			background: linear-gradient(to right, #06EBD8, #14B9D9);
			border-radius: 40rpx;

			.bin-confirm {
				color: white;
				font-size: 24rpx;
			}
		}
	}
</style>